<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="UTF-8">
		<!-- 使用UTF-8 -->
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<meta name="viewport"
			content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
		<!-- 设置移动终端可视区域 -->
		<meta content="telephone=no" name="format-detection">
		<!-- 禁止iPhone等手机自动将数字变成可点击的拨号连接 -->
		<title>登录</title>
		<link href="./survey_outside/css/style.css" type="text/css" rel="stylesheet" />
		<link href="./survey_outside/css/weui.css" type="text/css" rel="stylesheet" />
	</head>
	<body>
		<div id="containerVue" v-cloak style="padding-top: 0;">
			<div class="headerView">
				<i onclick="closeView()">&#139;</i>
				<h1>修改密码</h1>
				<div></div>
			</div>
			<div class="login">
				<div class="login_bg">
					<img src="./survey_outside/image/login-pic.png" alt="" class="img">
					<img src="./survey_outside/image/sysName.png" alt="" class="icon">
				</div>
				<div style="padding-top: 1.5rem;">
					<div class="login_input">
						<img class="login_input_icon" src="./survey_outside/image/iphone.png" alt="" />
						<input type="text" placeholder="请输入用户名" v-model="param.userName" />
					</div>
					<div class="login_input">
						<img class="login_input_icon" src="./survey_outside/image/iphone.png" alt="" />
						<input type="password" placeholder="请输入新密码" v-model="param.newPassword" />
					</div>
					<div class="login_input">
						<img class="login_input_icon" src="./survey_outside/image/iphone.png" alt="" />
						<input type="number" placeholder="请输入验证码" v-model="param.inputCapcha" />
						<span v-show="show" @click="getCode" class="code">获取验证码</span>
						<span v-show="!show" class="code">{{count}}s后再获取</span>
					</div>
				</div>
				<div class="btn" @click="login">
					确认<i></i>
				</div>
			</div>
		</div>
		<script src="./survey_outside/script/jquery-3.5.js"></script>
		<script src="./survey_outside/script/vue.js"></script>
		<script src="./survey_outside/script/api.js"></script>
		<script src="./survey_outside/script/ajax.js"></script>
		<script>
			var app = new Vue({
				el: '#containerVue',
				data: {
					param: {
						"newPassword": "",
						"userName": "",
						"inputCapcha": "",
					},
					show: true,
					count: '',
					timer: null,
				},
				created() {

				},
				watch: {},
				methods: {
					// 请求验证码
					getCode() {
						var that = this,
							regPhone = /^[1][3,4,5,7,8][0-9]{9}$/;
						if (this.param.userName == "") {
							$.Jwarning("请输入用户名")
						} else {
							if (confirm('此号码为OA系统登记的手机号码,确定要发送吗?') == true) {
								ajaxHttp({
									url: 'jeecg-boot/sys/user/changePwdMsg',
									type: 'get',
									data: {
										userName: that.param.userName
									},
									success: function(res) {
										console.log(res);
										// 本地存入token
										if (res.success) {
											$.Jsuccess(res.message);
											that.timeCode();
										} else {
											$.Jwarning(res.message);
										}
									}
								})
							} else {
								return false;
							}
						}
					},
					// 验证码倒计时
					timeCode() {
						const TIME_COUNT = 60;
						if (!this.timer) {
							this.count = TIME_COUNT;
							this.show = false;
							this.timer = setInterval(() => {
								if (this.count > 0 && this.count <= TIME_COUNT) {
									this.count--;
								} else {
									this.show = true;
									clearInterval(this.timer);
									this.timer = null;
								}
							}, 1000)
						}
					},
					// 修改密码提交判断
					login() {
						var that = this,
							regPhone = /^[1][3,4,5,7,8][0-9]{9}$/;
						if (this.param.userName == "") {
							$.Jwarning("请输入用户名")
						} else if (this.param.newPassword == "") {
							$.Jwarning("请输入新密码")
						} else if (!/^(?=.*[a-zA-Z])(?=.*\d)(?=.*[~!@#$%^&*()_+`\-={}:";'<>?,./]).{8,}$/.test(this.param.newPassword)) {
              $.Jwarning("密码由数字、大小写字母和特殊符号组成!")
            } else {
							ajaxHttp({
								url: 'jeecg-boot/sys/user/changeUserPassword',
								type: 'get',
								data: that.param,
								success: function(res) {
									// 本地存入token
									if (res.success) {
										$.Jsuccess(res.message);
										setTimeout(function() {
											window.location.href = "./login.html";
										}, 3000)
									} else {
										$.Jwarning(res.message)
									}
								}
							})
						}
					}
				}
			})
		</script>
	</body>
</html>
